import {StyleSheet, Text, View} from 'react-native';
import pageInfoList from '../../config/pageInfoList';

export interface NavBarProps {
  navigation: any;
}

const NavBar = (props: NavBarProps) => {
  const {navigation} = props;
  return (
    <View style={styles.navBar}>
      {pageInfoList?.map((o, index) => {
        return (
          <Text
            key={index}
            style={styles.navBarText}
            onPress={() => {
              navigation.navigate(o.navigateName);
            }}>
            {o.name}
          </Text>
        );
      })}
    </View>
  );
};
const styles = StyleSheet.create({
  navBar: {
    display: 'flex',
    justifyContent: 'center',
    alignItems: 'center',
    flexDirection: 'row',
    gap: 10,
    borderBottomWidth: 1,
    borderBottomColor: '#aaa',
    backgroundColor: '#fff',
  },
  navBarText: {
    fontSize: 20,
    lineHeight: 55,
    color: 'blue',
  },
});

export default NavBar;
